<template>
  <div class="head" :style="showHead ? '' : 'height:auto;'">
    <transition name="el-fade-in">
      <div class="erweima" v-if="showPic" :style="{ top: top + 'px', right: right }">
        <div><img src="@/assets/android.png" /><span>安卓</span></div>
        <div><img src="@/assets/iosDown.png" /><span>IOS</span></div>
        <i class="el-icon-close" style="
            cursor: pointer;
            position: absolute;
            top: 3px;
            color: #000;
            font-size: 24px;
            right: 6px;
          " @click="yc()"></i>
      </div>
    </transition>
    <div class="zhong" v-if="showHead">
      <div class="divdw-wrap" style="height: 60px!important;">
        <img src="../assets/floor_t.png" alt="" v-if="isHome" style="height:60px;width:auto;margin-right:20px;">

        <div class="divdw" :style="isHome ? 'left:200px;' : 'left:0;'">
          <img class="divdw_img" src="@/assets/bbcz/zydw01.png" alt="" />
          <span class="divdw_span">{{ location }}</span>
        </div>
      </div>

      <div class="list">
        <div><router-link to="/" v-if="!isHome">首页</router-link></div>
        <!-- businessType v-if="(user.shopType != 2||(user.businessType=='1'&&user.shopType == 2)) && (user.isAgent == 1 || user.isShop == 0)" -->
        <div @click="toRouter(1)">我要发布</div>
        <div @click="toRouter(2)" v-if="(user.isShop == 0 && user.isAgent == 0) || !loginstate">企业认证</router-link></div>
        <div style="" @click="toRouter(3)"
          v-if="user.enterpriseRecruitmentStatus != 1 && (user.isAgent == 0 || !loginstate)">
          销售顾问认证</div>
        <div class="relative downapp" style="margin-right: 20px;">
          下载APP
          <div class="erweima-wrap">
            <div class="erweima">
              <div><img src="@/assets/android.png" /><span>安卓</span></div>
              <div><img src="@/assets/iosDown.png" /><span>IOS</span></div>
            </div>
          </div>


        </div>
        <div class="v3-search-wrap" v-if="isHome">
          <input type="text" class="v3-search" placeholder="请输入关键字搜索" v-model="searchtext" @keyup.enter="search" />
          <i class="el-icon-search v3-search-ico" @click="search"></i>
        </div>
        <!-- <img class="div5 div5-img"  :src="!loginstate?'@/assets/tou.png':user.userImage||'@/assets/tou.png'" /> -->
        <template v-if="!loginstate">
          <img class="div5 div5-img" src="../assets/tou.png" />
          <span style="margin-left: 5px;margin-right: 10px;cursor: pointer;" @click="login">登录</span>
          <span style="cursor: pointer;" @click="tou_zhuce">注册</span>
        </template>
        <template v-else>
          <div style="margin-left:12px">
            <div class="div5 " @click="toRouter(5)" style="margin-left: 0;margin-right: 24px;position: relative;">消息
              <span class="msg-count">{{ msgCount > 99 ? '99+' : msgCount > 0 ? msgCount : '' }}</span>
            </div>
            <img class="div5 div5-img"
              :style="(user.userImage || user.image) ? 'vertical-align: middle;margin-right: 5px;border-radius: 50%;' : 'margin-right: 5px;border-radius: 50%;'"
              :src="user.userImage || user.image || require('../assets/tou.png')" />
            <span style="margin-right: 40px" @click="toUser()">我的</span>
            <span @click="loginout">退出</span>
          </div>
        </template>
        <!-- <div style="margin-left:42px;">
          <img src="../assets/tou.png" />
          <span>{{user.phone | hidePhone}}</span>
        </div>
        <div style="margin-left:12px;" @click="loginout">退出</div> -->
      </div>
    </div>
    <login ref="login" @succer="loginsucces"></login>
    <div :class="opacity ? 'opacity0' : 'opacity1'" v-show="issuestate"
      style="position: fixed;top:0;width: 100%;height: 100%;background-color: #333333;z-index: 1200;opacity: 0.9;">
      <div style="display: flex;flex-direction: column;align-items: center;margin-top: 14%;">
        <div style="display: flex;" class="wrapwrapwrap1" :style="'width:' + width">
          <template v-if="user.businessType == '1'">
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="user.shopType != 2" @click="issue(1)">
              <img src="../assets/cs.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">卖房</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="user.shopType != 2" @click="issue(2)">
              <img src="../assets/cz.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">租房</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" v-if="user.isShop == 1"
              @click="issue(16)">
              <img src="https://pic.bangbangtongcheng.com/static/bbzc/releaseFullTime.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">招全职</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" v-if="user.isShop == 1"
              @click="issue(15)">
              <img src="https://pic.bangbangtongcheng.com/static/bbzc/postPartTime.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">招兼职</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="user.isShop == '1' && user.enterpriseRecruitmentStatus == 1" @click="issue(17)">
              <img src="@/assets/v3/2house-info.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">公司资料</div>
            </div>




            <!-- <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="user.shopType == 2 && user.isShop == 1" @click="issue(3)">
              <img src="../assets/static/2house-info.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">门店轮播</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" v-if="user.shopType==1&&user.isShop==1" @click="issue(4)">
							<img src="../assets/static/2dynamic-mes.png" />
							<div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">门店资讯</div>
						</div> -->
            <!-- <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" v-if="user.shopType==2&&user.isShop=='1'" @click="issue(5)">
							<img src="../assets/static/2house-info.png" />
							<div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">楼盘轮播</div>
						</div>
						<div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" v-if="user.shopType==2&&user.isShop=='1'" @click="issue(6)">
							<img src="../assets/static/2dynamic-mes.png" />
							<div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">楼盘资讯</div>
						</div> -->
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(7)">
              <img src="../assets/static/byq01.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">帮友圈</div>
            </div>
          </template>
          <template v-else-if="user.businessType == '2'">

            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="(user.shopType == 2 || user.shopType == 1)" @click="issue(11)">
              <img src="../assets/static/mc01.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">卖车</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="(user.shopType == 3 || user.shopType == 4)" @click="issue(12)">
              <img src="../assets/static/fwxm01.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">服务项目</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="user.shopType != 3 && user.shopType != 4 && user.isShop == '1'" @click="issue(13)">
              <img src="../assets/static/zscx01.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">在售车系</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" v-if="user.isShop == 1"
              @click="issue(16)">
              <img src="https://pic.bangbangtongcheng.com/static/bbzc/releaseFullTime.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">招全职</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" v-if="user.isShop == 1"
              @click="issue(15)">
              <img src="https://pic.bangbangtongcheng.com/static/bbzc/postPartTime.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">招兼职</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="user.isShop == '1' && user.enterpriseRecruitmentStatus == 1" @click="issue(17)">
              <img src="@/assets/v3/2house-info.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">公司资料</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="user.isShop == '1' && user.enterpriseRecruitmentStatus != 1" @click="issue(14)">
              <img src="../assets/static/2house-info.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">门店轮播</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(7)">
              <img src="../assets/static/byq01.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">帮友圈</div>
            </div>
          </template>
          <template v-else>
            <template v-if="user.enterpriseRecruitmentStatus != '1'">
              <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(1)">
                <img src="../assets/cs.png" />
                <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">卖房</div>
              </div>
              <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(2)">
                <img src="../assets/cz.png" />
                <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">租房</div>
              </div>
              <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(11)">
                <img src="../assets/static/mc01.png" />
                <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">卖车</div>
              </div>
            </template>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(16)">
              <img src="https://pic.bangbangtongcheng.com/static/bbzc/releaseFullTime.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">招全职</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(15)">
              <img src="https://pic.bangbangtongcheng.com/static/bbzc/postPartTime.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">招兼职</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="user.enterpriseRecruitmentStatus != 1" @click="issue(18)">
              <img src="https://pic.bangbangtongcheng.com/static/bbzc/writeResume.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">写简历</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="user.enterpriseRecruitmentStatus == '1'" @click="issue(17)">
              <img src="@/assets/v3/2house-info.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">公司资料</div>
            </div>

            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(7)">
              <img src="../assets/static/byq01.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">帮友圈</div>
            </div>
          </template>
          <!-- <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(3)">
						<img src="../assets/cs.png" />
						<div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">卖车</div>
					</div>
					<div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(4)">
						<img src="../assets/cz.png" />
						<div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">在售车系</div>
					</div>
					<div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(5)">
						<img src="../assets/cz.png" />
						<div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">服务项目</div>
					</div>
					<div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(6)">
						<img src="../assets/cz.png" />
						<div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">帮友圈</div>
					</div> -->
        </div>
        <i class="el-icon-circle-close" style="font-size: 30px;margin-top: 74px;cursor: pointer;"
          @click="Move(), issuestate = false"></i>
      </div>
    </div>
    <div :class="opacity ? 'opacity0' : 'opacity1'" v-show="authstate"
      style="position: fixed;top:0;width: 100%;height: 100%;background-color: #333333;z-index: 1200;opacity: 0.9;">
      <div style="display: flex;flex-direction: column;align-items: center;margin-top: 14%;">
        <div style="display: flex;justify-content: space-between;" class="wrapwrapwrap2" :style="'width:' + width">
          <template v-if="type == 2">

            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="renzheng(1)">
              <img src="https://pic.bangbangtongcheng.com/static/fabu_c.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">认证房产店铺</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="renzheng(2)">
              <img src="https://pic.bangbangtongcheng.com/static/bbcz/dtzc01.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">认证汽车店铺</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;"
              v-if="user.enterpriseRecruitmentStatus == 0" @click="renzheng(5)">
              <img src="https://pic.bangbangtongcheng.com/static/bbzc/releaseFullTime.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">认证招聘企业</div>
            </div>
          </template>
          <template v-if="type == 3">

            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="renzheng(3)">
              <img src="https://pic.bangbangtongcheng.com/static/fabu_c.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">认证房产经纪人</div>
            </div>
            <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="renzheng(4)">
              <img src="https://pic.bangbangtongcheng.com/static/bbcz/dtzc01.png" />
              <div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">认证汽车销售顾问</div>
            </div>

          </template>

          <!-- <div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(3)">
						<img src="../assets/cs.png" />
						<div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">卖车</div>
					</div>
					<div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(4)">
						<img src="../assets/cz.png" />
						<div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">在售车系</div>
					</div>
					<div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(5)">
						<img src="../assets/cz.png" />
						<div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">服务项目</div>
					</div>
					<div style="display: flex;flex-direction: column;align-items: center;cursor: pointer;" @click="issue(6)">
						<img src="../assets/cz.png" />
						<div style="color: #FFFFFF;font-size: 30px;margin-top: 24px;">帮友圈</div>
					</div> -->
        </div>
        <i class="el-icon-circle-close" style="font-size: 30px;margin-top: 74px;cursor: pointer;"
          @click="Move(), issuestate = false, authstate = false, opacity = true"></i>
      </div>
    </div>
    <masks ref="mask"></masks>
  </div>
</template>
<script>
import login from "./login.vue";
import { mapState } from "vuex";
import masks from "@/views/invite/comp/mask";

export default {
  components: {
    login,
    masks,
  },
  props: {
    showHead: {
      type: Boolean,
      default: true,
    },
    isHome: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      searchtext: "",
      loginstate: false,
      user: {},
      issuestate: false,
      authstate: false,
      type: -1,
      location: "",
      showPic: false,
      top: 80,
      right: "calc((100vw - 1200px) / 2 + 156px)",

      opacity: true,
      width: 0,
    };
  },
  computed: {
    ...mapState({
      msgCount: (state) => state.msgCount,
    }),
  },
  created() {
    //判断是否登录

    this.getUser();
    this.initMap();
    // 查询是否有未审核的消息
    // console.log(this.$route.path);
    // document.removeEventListener('visibilitychange')
    document.addEventListener("visibilitychange", (e) => {
      console.log(111111111, e);
      if (!document.hidden) {
        var user = localStorage.getItem("userInfo")
          ? JSON.parse(localStorage.getItem("userInfo"))
          : null;
        if (user && user.phone) {
          // this.$getHttp("/mob/login/getUserInfoByPhone", {
          // 	phone: user.phone,
          // }).then((data)=>{
          // 	if (data.code == 200) {
          // 		localStorage.setItem("userInfo", JSON.stringify(data.userInfo));
          // 	}
          // })
        } else {
          // window.location.reload()
        }
        // window.location.reload()
      }
    });
  },
  destroyed() {
    document.removeEventListener("visibilitychange", () => {
      console.log(2222222222);
    });
  },
  mounted() {
    // window.addEventListener('click', (e) => {
    // this.showPic = false
    // }, false)
    window.addEventListener("scroll", (e) => {
      if (this.showPic) {
        this.showPic = false;
      }
    });
    this.getUser();
  },
  filters: {
    hidePhone(phone) {
      return phone.substring(0, 3) + "***" + phone.substring(phone.length - 2);
    },
  },

  methods: {
    search() {
      if (this.searchtext.trim() != "") {
        const routeLink = this.$router.resolve({
          path: "/index/bigSearch?search=" + this.searchtext + "&index=1",
        });
        window.open(routeLink.href, "_blank");
      }
    },
    setOpen(i) {
      this.showHead = false;
      console.log("123", i);
      this.toRouter(i);
    },
    downApp() {
      this.showPic = true;
    },
    yc() {
      this.showPic = false;
    },
    // 获取定位
    initMap() {
      let data = {
        key: "ZYIBZ-6VVRW-NCURN-O6GZO-2VRAH-KIBJV",
        output: "jsonp",
      };
      this.$jsonp("https://apis.map.qq.com/ws/location/v1/ip", data).then(
        (data) => {
          this.location = data.result.ad_info.city;
        }
      );
    },

    getUser() {
      let user = JSON.parse(localStorage.getItem("userInfo"));
      if (user != null) {
        this.loginstate = true;
        this.user = user;

        console.log("用户信息");
        console.log(user);
        return true;
      } else {
        this.loginstate = false;
        return false;
      }
    },
    login() {
      this.$refs.login.login();
    },
    tou_zhuce() {
      this.$refs.login.tou_zhuce();
    },
    loginsucces(e) {
      if (e) {
        this.getUser();
      }
    },
    loginout() {
      localStorage.removeItem("userInfo");
      localStorage.removeItem("contrastIdList");
      localStorage.removeItem("confirm");
      this.getUser();
      this.$router.push("/");
    },
    toUser() {
      if (this.loginstate) {
        //查询最新用户信息
        this.$getHttp("/mob/login/getUserInfoByPhone", {
          phone: JSON.parse(localStorage.getItem("userInfo")).phone,
        }).then((data) => {
          if (data.code == 200) {
            localStorage.setItem("userInfo", JSON.stringify(data.userInfo));
          }
        });
        this.openUrl("/my/bbcz/wdRelease");
        // this.$router.push("/my/bbcz/bbczpersonal");
      } else {
        this.$message({
          message: "请登录！",
          type: "error",
          offset: 120,
          duration: 2000,
        });
      }
    },
    renzheng(type) {
      if (!this.getUser) return;
      let routeLink;
      switch (type) {
        case 1: //认证房店铺
          routeLink = this.$router.resolve({
            path: "/index/merchantAttestation",
          });
          window.open(routeLink.href, "_blank");
          break;
        case 2: //认证车店铺
          routeLink = this.$router.resolve({
            path: "/release/peakfirerz",
          });
          window.open(routeLink.href, "_blank");
          break;
        case 3: //认证房经纪人
          routeLink = this.$router.resolve({
            path: "/index/brokerAttestation",
          });
          window.open(routeLink.href, "_blank");
          break;
        case 4: //认证车销售顾问
          routeLink = this.$router.resolve({
            path: "/release/certificationBroker",
          });
          window.open(routeLink.href, "_blank");
          break;
        case 5: //认证招聘企业
          routeLink = this.$router.resolve({
            path: "/invite/release",
            query: {
              type: "certificationCompany",
            },
          });
          window.open(routeLink.href, "_blank");
          break;
        default:
          break;
      }
    },
    toRouter(type) {
      if (this.getUser()) {
        let routeLink = "";
        switch (type) {
          case 1:
            this.issuestate = true;
            this.stopMove();
            setTimeout(() => {
              var divDom = document
                .getElementsByClassName("wrapwrapwrap1")[0]
                .getElementsByTagName("div");
              var len = divDom.length / 2;
              this.width =
                len >= 4 ? Math.ceil(len / 2) * 220 + "px" : len * 220 + "px";

              setTimeout(() => {
                this.opacity = false;
              }, 220);
            }, 50);
            break;
          case 2:
            this.authstate = true;
            this.type = type;

            setTimeout(() => {
              var divDom = document
                .getElementsByClassName("wrapwrapwrap2")[0]
                .getElementsByTagName("div");
              var len = divDom.length / 2;
              this.width =
                len >= 4 ? Math.ceil(len / 2) * 220 + "px" : len * 220 + "px";
              setTimeout(() => {
                this.opacity = false;
              }, 220);
            }, 50);

            // routeLink = this.$router.resolve({
            // 		path: '/index/merchantAttestation?id='+this.user.id
            // 	})
            // window.open(routeLink.href, '_blank')
            // this.$router.push({
            // 	path:"/index/merchantAttestation",
            // 	query:{
            // 		id:this.user.id
            // 	}
            // })
            break;
          case 3:
            this.authstate = true;
            this.type = type;
            setTimeout(() => {
              var divDom = document
                .getElementsByClassName("wrapwrapwrap2")[0]
                .getElementsByTagName("div");
              var len = divDom.length / 2;
              this.width =
                len >= 4 ? Math.ceil(len / 2) * 220 + "px" : len * 220 + "px";
              setTimeout(() => {
                this.opacity = false;
              }, 220);
            }, 50);
            //  routeLink = this.$router.resolve({
            // 		path: '/index/brokerAttestation?id='+this.user.id
            // 	})
            // window.open(routeLink.href, '_blank')
            // this.$router.push({
            // 	path:"/index/brokerAttestation",
            // 	query:{
            // 		id:this.user.id
            // 	}
            // })
            break;
          case 4:
            this.showPic = true;
            break;
          case 5:
            this.openUrl("/my/information");

            break;
        }
      } else {
        this.$message({
          message: "请先登录！",
          type: "error",
          offset: 120,
          duration: 2000,
        });
      }
    },
    issue(type) {
      if (type == 1) {
        let routeLink = this.$router.resolve({
          path: "/release/sell",
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 2) {
        let routeLink = this.$router.resolve({
          path: "/release/rent",
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 3) {
        // 房 门店轮播
        let routeLink = this.$router.resolve({
          path: "/my/isshouse?types=1",
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 4) {
        // 房 门店咨询
        let routeLink = this.$router.resolve({
          path: "/my/isshouse?types=2",
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 5) {
        let routeLink = this.$router.resolve({
          path: "/index/storey",
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 6) {
        let routeLink = this.$router.resolve({
          path: "/index/storey",
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 7) {
        let routeLink = this.$router.resolve({
          path: "/release/releaseCircleFriends",
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 11) {
        //车主卖车
        let routeLink = this.$router.resolve({
          path: "/my/releaseOptions?types=sellCar",
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 12) {
        let routeLink = this.$router.resolve({
          path: "/release/servicesAvailable",
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 13) {
        let routeLink = this.$router.resolve({
          path: "/release/sellCar",
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 14) {
        //车主轮播
        let routeLink = this.$router.resolve({
          path: "/my/releaseOptions?types=cal&index=1",
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 15) {
        //兼职
        let routeLink = this.$router.resolve({
          path: "/invite/release",
          query: {
            type: "publishPartTimeJob",
          },
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 16) {
        //全职
        if (this.user.enterpriseRecruitmentStatus == 1) {
          let routeLink = this.$router.resolve({
            path: "/invite/release",
            query: {
              type: "publishFullTimeJob",
            },
          });
          window.open(routeLink.href, "_blank");
        } else {
          this.Move();
          console.log("this.$refs.mask", this.$refs.mask);
          // 普通人要发布全职要认证企业信息
          this.$refs.mask.open("authauth");
        }
      } else if (type == 17) {
        if (this.user.businessType == 1 && this.user.shopType == 2 && this.user.isShop == 1) {
          if (!this.user.buildingsId) {
            this.myErrorMessage('您还未发布楼盘，请前往PC端发布楼盘！')
            return
          }
        }
        //公司
        let routeLink = this.$router.resolve({
          path: "/invite/release",
          query: {
            type: "releaseCompany",
          },
        });
        window.open(routeLink.href, "_blank");
      } else if (type == 18) {
        // 简历
        let routeLink = this.$router.resolve({
          path: "/invite/release",
          query: {
            type: "publishResume",
          },
        });
        window.open(routeLink.href, "_blank");
      }
    },
  },
};
</script>
<style lang="less" scoped>
.opacity0 {
  opacity: 0;
}

.opacity1 {
  opacity: 1;
}

.wrapwrapwrap1,
.wrapwrapwrap2 {
  flex-wrap: wrap;
  justify-content: center;

  div {
    width: 200px;
    text-align: center;

    div {
      margin-top: 6px !important;
      margin-bottom: 24px;
      white-space: nowrap;
    }
  }
}

.wrapwrapwrap {
  &>div {
    margin: 0 20px;
  }

  align-items: center;
  flex-wrap: wrap;
  width: 720px;
}

.head {
  width: 100%;
  height: 60px;
  color: #ffffff;
  position: relative;
  background-color: #666;

  img {
    width: 100px;
    height: 100px;
  }

  .div5-img {
    width: 26px;
    height: 26px;
    vertical-align: bottom;
  }

  .zhong {
    position: relative;
    right: 0;
    width: 1200px;
    margin: 0 auto;
    // margin-left: 50%;
    // transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-items: center;

    .divdw-wrap {
      height: 60px;
      width: 480px;
      position: relative;
      display: flex;
      align-items: center;

      .divdw {
        position: absolute;
        // left: 0;
        top: 55% !important;
        transform: translateY(-50%);
        // height: 32px!important;
        background-color: rgba(51, 51, 51, 0.46);
        border-radius: 25px;
        border: 1px solid #ffffff;
        // margin-top: 10px;
        display: inline-block;

        // display: flex;
        // align-items: center;
        // justify-content: space-between;
        .divdw_img {
          //   width: 24px!important;
          //   height: 24px!important;
          margin-left: 10px;
        }

        .divdw_span {
          //   font-size: 20px!important;
          //   font-weight: 400!important;
          color: #ffffff;
          margin-right: 10px;
        }
      }
    }

    .list {
      position: absolute;
      top: 18px;
      right: 0;
      display: flex;
      align-items: center;

      .v3-search-wrap {
        margin: 0 20px 0 0px;
        position: relative;
        width: 210px;
        height: 32px;
        line-height: 32px;
        background: #ffffff;
        border-radius: 16px 16px 16px 16px;
        overflow: hidden;
        opacity: 1;
        font-size: 16px;
        font-weight: 400;

        .v3-search {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          color: #333;
          padding: 0 40px 0 10px;
        }

        .v3-search-ico {
          position: absolute;
          top: 50%;
          transform: translateY(-50%);
          right: 10px;
          font-size: 22px;
          font-weight: 400;
          color: #64b6a8;
        }
      }

      span {
        font-size: 18px;
      }

      div {
        display: inline-block;
        font-size: 18px;
        margin-left: 32px;
        cursor: pointer;
        z-index: 999;

        img {
          width: 22px;
          height: 22px;
        }

        span {
          //   vertical-align: middle;
        }
      }
    }
  }
}

.downapp {
  &:hover .erweima-wrap {
    opacity: 1;
    transform: translateY(0%);
    height: auto;
    width: auto;
    overflow: visible;
  }
}

.erweima-wrap {
  transition: all 0.3s;
  opacity: 0;
  transform: translateY(-10%);
  height: 0;
  width: 0;
  overflow: hidden;
  position: absolute;
  left: 0%;
  top: 46px;
  z-index: 9999999;
  margin-left: 0 !important;
}

.erweima {
  background-color: #f7f0f0;
  border: 1px solid #e0e0e0;
  padding: 20px;
  border-radius: 5px;
  display: flex !important;
  margin-left: 0 !important;

  //   margin-right: 10px !important;
  div {
    &:not(:last-child) {
      margin-right: 10px !important;
    }

    z-index: 99999;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    margin-left: 0 !important;

    img {
      width: 150px !important;
      height: 150px !important;
    }

    span {
      color: #000;
    }
  }
}
</style>
